<template>
  <div class="global-popup" v-show="isShow">
    <component ref="childComp" :is="childCompType" />
  </div>
</template>

<script>
export default {
  components: {},
  data() {
    return {
      isShow: false,
      isMaskClick: true,
      childCompType: ''
    }
  },
  mounted() {},
  methods: {
    init({ isMaskClick, childCompType }) {
      this.isMaskClick = isMaskClick
      this.childCompType = childCompType
    },
    show() {
      this.isShow = true
    },
    hide() {
      this.isShow = false
    },
    maskClick() {
      if (!this.isMaskClick) return

      this.hide()
    }
  }
}
</script>

<style lang="scss">
.global-popup {
  width: 100vw;
  height: 100vh;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 2001;
}
</style>
